<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <!-- 加载部部样式及META信息 -->
    <title>管理员</title>
    <div th:replace="common/meta"></div>
    <script>
        require.config.jsname = "backend/profile/profile";
        require.config.modulename = "admin"
        require.config.controllername = "auth.admin"
        require.config.actionname = "index"
        require.config.moduleurl = "/admin/index"
    </script>
</head>


<body class="inside-header inside-aside ">
<div id="main" role="main">
    <div class="tab-content tab-addtabs">
        <div id="content">
            <div class="row">
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                    <section class="content-header hide">
                        <h1>
                            控制台                                    <small>Control panel</small>
                        </h1>
                    </section>
                    <!-- RIBBON -->
                    <div id="ribbon">
                        <ol class="breadcrumb pull-left">
                            <li><a href="dashboard" class="addtabsit"><i class="fa fa-dashboard"></i> 控制台</a></li>
                        </ol>
                        <ol class="breadcrumb pull-right">
                            <li><a href="javascript:;" data-url="general">常规管理</a></li>
                            <li><a href="javascript:;" data-url="general/profile">个人配置</a></li>
                        </ol>
                    </div>
                    <!-- END RIBBON -->
                    <div class="content">
                        <style>
                            .profile-avatar-container {
                                position:relative;
                                width:100px;margin:0 auto;
                            }
                            .profile-avatar-container .profile-user-img{
                                width:100px;
                                height:100px;
                            }
                            .profile-avatar-container .profile-avatar-text {
                                display:none;
                            }
                            .profile-avatar-container:hover .profile-avatar-text {
                                display:block;
                                position:absolute;
                                height:100px;
                                width:100px;
                                background:#444;
                                opacity: .6;
                                color: #fff;
                                top:0;
                                left:0;
                                line-height: 100px;
                                text-align: center;
                            }
                            .profile-avatar-container button{
                                position:absolute;
                                top:0;left:0;width:100px;height:100px;opacity: 0;
                            }
                        </style>
                        <div class="row animated fadeInRight">
                            <div class="col-md-4">
                                <div class="box box-success">
                                    <div class="panel-heading">
                                        个人资料            </div>
                                    <div class="panel-body">

                                        <form id="update-form" role="form" data-toggle="validator" method="POST" action="/api/profile/edit">

                                            <div class="box-body box-profile">
                                                <div class="profile-avatar-container">
                                                    <img class="profile-user-img img-responsive img-circle plupload" th:src="${user.avatar}" alt="">
                                                    <div class="profile-avatar-text img-circle">点击更换</div>
                                                    <input type="hidden" id="avatar" name="avatar" th:value="${user.avatar}" />
                                                    <button id="plupload-avatar" class="plupload"  data-after-upload="changeavatar"><i class="fa fa-upload"></i> 上传</button>
                                                </div>

                                                <h3 class="profile-username text-center">admin</h3>

                                                <p class="text-muted text-center" th:text="${user.email}"></p>
                                                <div class="form-group">
                                                    <label for="username" class="control-label">用户名:</label>
                                                    <input id="username" type="text" class="form-control" name="username" th:value="${user.username}" disabled />
                                                </div>
                                                <div class="form-group">
                                                    <label for="email" class="control-label">Email:</label>
                                                    <input id="email" type="text" class="form-control" name="email" th:value="${user.email}" data-rule="required;email" />
                                                </div>
                                                <div class="form-group">
                                                    <label for="nickname" class="control-label">昵称:</label>
                                                    <input id="nickname" type="text" class="form-control" name="nickname" th:value="${user.nickname}" data-rule="required" />
                                                </div>
                                                <div class="form-group">
                                                    <label for="password" class="control-label">密码:</label>
                                                    <input id="password" type="text" class="form-control" name="password" th:value="${user.password}"/>
                                                </div>
                                                <div class="form-group">
                                                    <button type="submit" class="btn btn-lg btn-success">提交</button>
                                                 <!--   <button type="reset" class="btn btn-default">重置</button>-->
                                                </div>

                                            </div>
                                        </form>
                                    </div>
                                </div>

                            </div>
                        </div>

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="assets/js/require.min.js" data-main="assets/js/require-backend.min.js"></script>
</body>
<div th:replace="common/script"></div>
</html>